// $(window).load(function() {
//     $('.preloader').fadeOut('slow');
//  });

(function ($) {
    "use strict";

    // theme color change
    const root_theme = document.querySelector(':root');
    let lsPrimaryColor, lsSecondaryColor

    /* ------------------------------------------------------ */    
    // Preloader Area
    $(window).on('load', function () {
        $('.preloader').fadeOut('slow');
        
        // set color in localStorage
        lsPrimaryColor = window.localStorage.getItem("uniqueg_primary_color")
        lsSecondaryColor = window.localStorage.getItem("uniqueg_secondary_color")

        if(lsPrimaryColor) root_theme.style.setProperty('--primary-color', lsPrimaryColor);
        if(lsSecondaryColor) root_theme.style.setProperty('--secondary-color', lsSecondaryColor);   
        
        // checked active color
        $(`[data-color="${lsPrimaryColor}"]`).addClass('active')
        $(`[data-color="${lsSecondaryColor}"]`).addClass('active')
    });

     // Show/hide the "Back to Top" button based on scroll position
    $(window).scroll(function() {
        if ($(this).scrollTop() > 100) {
            $('#back-to-top').removeClass("back-to-top-hide");
        } else {
            $('#back-to-top').addClass("back-to-top-hide");
        }

         // this will work when your window scrolled.
         var height = $(window).scrollTop(); //getting the scrolling height of window
         if (height > 45) {
             $(".main-header").addClass("sticy_header");
         } else {
             $(".main-header").removeClass('sticy_header');
         }
    });

    // mobile menu
    // sidebar
    $('#open-sidebar').click(function (event) {
        $('.sidebar').addClass('sidebar-open');
        event.preventDefault();
    })
    $('#close-sidebar').click(function () {
        $('.sidebar').removeClass('sidebar-open');
        event.preventDefault();
    })

    // sidebar sub menu
    var subMenu = document.querySelector(".sidebar-sub-menu");
    subMenu.style.display = "none";
    $("a.with-side-sub").click(function () {
        if (subMenu.style.display == "none") {
            subMenu.style.display = "block"
        } else {
            subMenu.style.display = "none"
        }
    })

    // counterup
    $('.counter').counterUp({
        delay: 10,
        time: 1000
    });
    // Isotope Active
    var $grid = $('.portfolio-active').isotope({
        itemSelector: '.grid-item',
    })

    //isotope button
    $('.portfolio-menu').on('click', 'button', function () {
        var filterValue = $(this).attr('data-filter');
        $grid.isotope({
            filter: filterValue
        });
    });

    //for menu active class
    $('.portfolio-menu button').on('click', function (event) {
        $(this).siblings('.active').removeClass('active');
        $(this).addClass('active');
        event.preventDefault();
    });


    // Main slider
    $('.slider-active').slick({
        dots: false,
        infinite: true,
        autoplay: false,
        arrows: false,
        fade: true,
        speed: 500,
        slidesToShow: 1,
        slidesToScroll: 1,
    })


    // Testimonial slider
    $('.testimonial-slider-active').slick({
        dots: false,
        infinite: true,
        autoplay: true,
        speed: 300,
        slidesToShow: 3,
        slidesToScroll: 1,
        responsive: [{
                breakpoint: 1540,
                settings: {
                    dots: false,
                    infinite: true,
                    autoplay: true,
                    arrows: false,
                    slidesToShow: 3,
                    slidesToScroll: 3
                }
            },
            {
                breakpoint: 1200,
                settings: {
                    dots: false,
                    infinite: true,
                    autoplay: true,
                    arrows: false,
                    slidesToShow: 3,
                    slidesToScroll: 3
                }
            },
            {
                breakpoint: 992,
                settings: {
                    infinite: true,
                    autoplay: true,
                    arrows: false,
                    dots: false,
                    slidesToShow: 2,
                    slidesToScroll: 1
                }
            },
            {
                breakpoint: 768,
                settings: {
                    infinite: true,
                    autoplay: true,
                    arrows: false,
                    dots: false,
                    slidesToShow: 1,
                    slidesToScroll: 1
                }
            }
        ]
    })



    // Brand slider
    $('.brand-slider-active').slick({
        dots: false,
        infinite: true,
        autoplay: true,
        arrows: true,
        speed: 300,
        slidesToShow: 5,
        responsive: [{
                breakpoint: 1540,
                settings: {
                    dots: false,
                    infinite: true,
                    autoplay: true,
                    arrows: false,
                    slidesToShow: 5,
                    slidesToScroll: 1
                }
            },
            {
                breakpoint: 1200,
                settings: {
                    dots: false,
                    infinite: true,
                    autoplay: true,
                    arrows: false,
                    slidesToShow: 5,
                    slidesToScroll: 1
                }
            },
            {
                breakpoint: 992,
                settings: {
                    infinite: true,
                    autoplay: true,
                    arrows: false,
                    dots: false,
                    slidesToShow: 4,
                    slidesToScroll: 1
                }
            },
            {
                breakpoint: 768,
                settings: {
                    infinite: true,
                    autoplay: true,
                    arrows: false,
                    dots: false,
                    slidesToShow: 2,
                    slidesToScroll: 1
                }
            },
            {
                breakpoint: 410,
                settings: {
                    infinite: true,
                    autoplay: true,
                    arrows: false,
                    dots: false,
                    slidesToShow: 1,
                    slidesToScroll: 1
                }
            }
        ]
    })



    // blog-slider
    $('.blog-slider').slick({
        dots: false,
        infinite: true,
        autoplay: true,
        arrows: true,
        prevArrow: '<button type="button" class="slick-prev"><i class="fas fa-chevron-left"></i></button>',
        nextArrow: '<button type="button" class="slick-next"><i class="fas fa-chevron-right"></i></button>',
        speed: 300,
        slidesToShow: 1,
        slidesToScroll: 1,
    })


    // recent post slider
    $('.recent-post-active').slick({
        dots: false,
        infinite: true,
        autoplay: true,
        arrows: false,
        speed: 300,
        slidesToShow: 3,
        slidesToScroll: 1,
        responsive: [{
                breakpoint: 992,
                settings: {
                    infinite: true,
                    autoplay: true,
                    arrows: false,
                    dots: false,
                    slidesToShow: 2,
                    slidesToScroll: 1
                }
            },
            {
                breakpoint: 768,
                settings: {
                    infinite: true,
                    autoplay: true,
                    arrows: false,
                    dots: false,
                    slidesToShow: 1,
                    slidesToScroll: 1
                }
            }
        ]
    })


    // team slider
    $('.team-content-active').slick({
        slidesToShow: 1,
        slidesToScroll: 1,
        arrows: false,
        fade: true,
        asNavFor: '.team-slider-active'
    });
    $('.team-slider-active').slick({
        slidesToShow: 7 ,
        slidesToScroll: 1,
        asNavFor: '.team-content-active',
        dots: false,
        arrows: false,
        centerMode: true,
        focusOnSelect: true,
        centerPadding:0,
        responsive: [{
            breakpoint: 992,
            settings: {
                infinite: true,
                autoplay: true,
                arrows: false,
                dots: false,
                slidesToShow: 5,
                slidesToScroll: 1
            }
        },
        {
            breakpoint: 768,
            settings: {
                infinite: true,
                autoplay: true,
                arrows: false,
                dots: false,
                slidesToShow: 3,
                slidesToScroll: 1
            }
        }
    ]
    });

    // primary color
    $('.change_prime_color').click(function() {
        const newColor = $(this).data('color');

        root_theme.style.setProperty('--primary-color', newColor);

        // Set color in localStorage
        window.localStorage.setItem('uniqueg_primary_color', newColor);

        // Remove active class from all check-icons
        $('.change_prime_color').removeClass('active');
        
        // Add active class to the clicked check-icon
        $(this).addClass('active');
    
    });

    // secondary color
    $('.change_sec_color').click(function() {
        const newColor = $(this).data('color');
        
        root_theme.style.setProperty('--secondary-color', newColor);

        // Set color in localStorage
        window.localStorage.setItem('uniqueg_secondary_color', newColor);

        // Remove active class from all check-icons
        $('.change_sec_color').removeClass('active');
        
        // Add active class to the clicked check-icon
        $(this).addClass('active');
    
    })

    // collapse color settings
    $(document).click(function (event) {
        var target = $(event.target);
        if (!target.closest('.theme_settings').length && $('.theme_settings').is(':visible')) {
            $(".theme_settings").removeClass("show-settings")

        }
    });

    $("#settings_toggler").click((e) => {
        $(".theme_settings").toggleClass("show-settings")
    })

    // back to top
    $("#back-to-top").click(() => {
        if (window.pageYOffset < 50) {
            $(this).addClass("hide")
        } else {
            $(this).removeClass("hide")
        }
        window.scrollTo({
            top: 0
        })
    })   

    

    

})(jQuery);
